/*  */
@width: 230px;
.templatePreview {
  width: auto;

  &--container {
    width: 100%;
  }

  .text,
  .image,
  .video,
  .audio,
  .generalPurposeCard,
  .otherTemplate {
    padding: 10px;
    border-radius: 6px;
    background-color: #eceff7;
    max-width: @width;
    display: inline-block;
  }

  .head {
    img,
    video {
      width: 100%;
    }
  }

  .text,
  .image,
  .video,
  .audio {
    img,
    video,
    audio {
      width: 100%;
    }
  }

  .generalPurposeCard {
    flex-shrink: 0;
    width: @width;

    &:not(:last-child) {
      margin-right: 10px;
    }

    video {
      width: 100%;
      height: 120px;
    }

    img {
      width: 100%;
    }

    .info {
      padding: 10px 0;
      width: 100%;

      .describe {
        margin-top: 5px;
      }
    }

    .btns {
      & > div:not(:last-child) {
        margin-bottom: 5px;
      }
    }
  }

  .generalPurposeCardCarousel {
    display: flex;
  }

  .menuBtns {
    font-size: 12px;
    margin-top: 10px;

    .ant-btn-sm {
      font-size: 12px;
    }

    a.am-button {
      display: inline-block;
      height: 23px;
      line-height: 23px;
      font-size: 12px;
    }

    button {
      margin-bottom: 5px;
    }

    button:not(:last-child) {
      margin-right: 5px;
    }
  }
}
